<div>
	<div ng-show="isNotRangePeriod()">
		<div class="btn-group btn-group-sm" style="margin-top:0px;width:400px;float:left;">
			<button type="button" class="btn btn-success" ng-click="changeToRange()"><span class="glyphicon glyphicon-th-list"></span></button>
			<button type="button" class="btn btn-default" ng-click="changeToRealtime()" ng-show="useRealtime" ng-disabled="disableButton" ng-class="getRealtimeBtnClass()" style="padding-top:3px;padding-bottom:3px;line-height:1.1;font-size:10px">REAL<br/>TIME</button>
			<button type="button" class="btn btn-default" ng-repeat="period in aReadablePeriodTime" ng-class="getPeriodClass( period )" ng-click="changePeriodTimeOfLast( period )" ng-disabled="disableButton">{{getPeriodLabel(period)}}</button>
		</div>
		<div class="btn-group btn-group-sm input-group input-group-sm" style="float:left;margin-top:0px;padding-left:6px;width:146px;" ng-show="showUpdate()">
			<span class="input-group-addon">
				<label style="margin:0;">
					<input type="checkbox" ng-model="autoUpdate" ng-click="changeUpdateSetting()"> Update
				</label>
			</span>
			<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
				{{timeLeft}} sec <span class="caret"></span>
			</button>
			<ul class="dropdown-menu" role="menu">
				<li ng-repeat="t in timeList">
					<a href ng-click="setAutoUpdateTime(t.time)">{{t.label}}</a>
				</li>
			</ul>
		</div>
	</div>
	<div ng-show="isRangePeriod()" class="datetimepicker input-group input-group-sm date" style="width:420px">
		<span class="input-group-btn">
			<button class="btn btn-success" ng-click="changeToLast('last')">
				<span class="glyphicon glyphicon-calendar"></span>
			</button>
		</span>
		<input id="from-picker-alt" type="text" class="form-control" readonly style="background-color: #FFF">
		<span class="input-group-addon">
			<span class="glyphicon glyphicon-minus"></span>
		</span>
		<input id="to-picker-alt" type="text" class="form-control" readonly style="background-color: #FFF">
		<span class="input-group-btn">
			<button class="btn" ng-click="search()">
				<span class="glyphicon glyphicon-search"></span>
			</button>
		</span>
	</div>
	<div id="ui-datepicker-div">
		<div id="from-picker"></div>
		<div id="to-picker" ></div>
		<div class="btn-group btn-group-justified" style="padding-top:6px;">
			<div class="btn-group" role="group" ng-repeat="period in aReadablePeriodTime" >
				<button type="button" class="btn btn-default btn-sm" ng-class="getPeriodClassInCalendar( period )" ng-click="setPeriodTimeOfCalendar(period)">{{period}}</button>
			</div>
		</div>
		<div class="guide"></div>
		<div class="ui-datepicker-buttonpane" style="text-align:right;font-weight:bold">
			<button type="button" class="ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all">Done</button>
		</div>
	</div>
</div>